<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>  
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>食品会-商品搜索</title>
<link href="../../css/index.css" type="text/css" rel="stylesheet">
<link type="text/css" rel="stylesheet" href="../../css/goodsStyle.css"/> 
</head>
<body id="top">
		<div class="jdm-toolbar-wrap J-wrap">                
			<div class="jdm-toolbar J-toolbar">                    
				 <div class="jdm-toolbar-panels J-panel">                                             
				</div>                                       
				<div class="jdm-toolbar-tabs J-tab">  
					<div data-type="bar" class="J-trigger jdm-toolbar-tab jdm-tbar-tab-cart">                                
						<i class="tab-ico"></i>  <a href="${pageContext.request.contextPath}/Carts?userId=${sessionScope.user.userId}">                              <em class="tab-text">购物车                                
						</em>  </a>                                                
					</div>   
					<div class="J-trigger jdm-toolbar-tab jdm-tbar-tab-message" data-name="message"><a target="_blank" href="#">
					<i class="tab-ico"></i>                                
					<em class="tab-text">                                    我的消息                                
					</em></a>                                                
				</div>                     
			</div>                     
			<div class="jdm-toolbar-footer">                        
				<div data-type="link" id="#top" class="J-trigger jdm-toolbar-tab jdm-tbar-tab-top">                                
					<a href="#" clstag="h|keycount|cebianlan_h|top">                                
						<i class="tab-ico"></i>                                <em class="tab-text">顶部</em>                                
					</a>                         
				</div>                        
				<div data-type="link" class="J-trigger jdm-toolbar-tab jdm-tbar-tab-feedback">                                 
					<a href="http://surveys.jd.com/index.php?r=survey/index/sid/889711/newtest/Y/lang/zh-Hans" target="_blank" clstag="h|keycount|cebianlan_h|feedback">                                    
						<i class="tab-ico"></i>                                    
						<em class="tab-text">反馈</em>                                
					</a>                        
				</div>                        
			</div>                    
			<div class="jdm-toolbar-mini">                    
			</div>                
		</div>                
		<div id="J-toolbar-load-hook" clstag="h|keycount|cebianlan_h|load"></div>            
	</div>
		<!-----------------------------------------顶部-------------->
		<header id="header">
			<div class="header-box">
				<ul class="header-left">
				</ul>
				<ul class="header-right">
					<li class="denglu"><a href="${pageContext.request.contextPath}/jsp/user/userLogin.jsp">您好，请登录</a> <a href="${pageContext.request.contextPath}/jsp/user/userRegister.jsp"  class="red">免费注册</a></li> 
					<li class="shu"></li>
					<li class="denglu"><a href="#">我的订单</a></li>
					<li class="denglu"><a href="${pageContext.request.contextPath}/showFavorite?userId=${sessionScope.user.userId}">我的收藏夹</a></li>
					<li class="denglu"><a href="${pageContext.request.contextPath}/getUsers?userId=${sessionScope.user.userId}">个人中心</a></li>
					<li class="denglu"><a href="${pageContext.request.contextPath}/jsp/shop/ShopLogin.jsp">卖家中心</a></li>
					<li class="denglu"><a href="${pageContext.request.contextPath}/jsp/login/login.jsp">管理员中心</a></li>
				</ul>
			</div>
		</header>
		<div class="w">
			<div class="logo"><a href="${pageContext.request.contextPath}/index.jsp"><img width="100" height= "80" src="./../../images/logo.png"></a></div>
			<div class="search" id="search">
				<input type="text" placeholder="搜索" class="text" id="textt">
				<button class="button" onclick="returnRes()">搜索</button>
			</div>
			<div class="right">
				<i class="gw-left" style="background:url(./../../images/jd2015img.png)0 -58px no-repeat;width:24px;height:24px;"></i>
				<i class="gw-right">></i>
				<i class="gw-count">0</i>
				<a href="${pageContext.request.contextPath}/Carts?userId=${sessionScope.user.userId}">我的购物车</a>
				<div class="dorpdown-layer">
					<img src="./../../images/settleup-nogoods.png">
					购物车中还没有商品，赶紧选购吧！
				</div>
			</div>
			<div class="hotwords">
				<a href="#">海苔</a>
				<a href="#">果冻</a>
				<a href="#">饼干</a>
				<a href="#">锅巴</a>
				<a href="#">可乐</a>
			</div>
		</div>
		
		<div class="clear"></div>
		<!--轮播图上方导航栏  一栏-->
		<div id="navv">
		</div>
		<div class="focus">
			<div class="focus-a">
				<!-- <div class="fouc-img1"><img src="./../../images/5689d4ebN19f155a6.jpg" class="nav-img2"></div>
				<div class="fouc-font"><a href="">全部商品分类</a> </div> -->
			</div>
			<div class="focus-b">
				<ul>
					<li><a href="${pageContext.request.contextPath}/index.jsp">首页</a></li>
					<li><a href="#" onclick="showGoods(0)">坚果炒货</a></li>
					<li><a href="#" onclick="showGoods(1)">饼干蛋糕</a></li>
					<li><a href="#" onclick="showGoods(2)">糖果巧克力</a></li>
					<li><a href="#" onclick="showGoods(3)">肉类制品</a></li>
					<li><a href="#" onclick="showGoods(4)">膨化食品</a></li>
					<li><a href="#" onclick="showGoods(5)">饮料牛奶</a></li>
				</ul>
			</div>
<!--*******************  筛选条件部分  ****************************-->
     <!--End Menu End-->
    <div class="i_bg" id="goods_tj">
    <span class="fl">筛选条件 >  </span>
        <div class="postion">
        <span class="n_ch">
            <span class="fl"><div id="Res"></div></span>
        </span>
        </div>
        <!--Begin 筛选条件 Begin-->
        <div class="content ">
            <table border="0" class="choice">
                <tr>
                    <td width="70">&nbsp; 品牌：</td>
                    <td class="td_a">
                    <div id="direction">
                        <a href="#" class="active">不限</a>
                        <a href="#">森宝</a>
                        <a href="#">甘源</a>
                        <a href="#">芳草</a>
                        <a href="#">百年树</a>
                        <a href="#">佳栗福</a>
                        <a href="#">佩兰</a>
                        </div>
                    </td>
                </tr>
                <tr>
                    <td>&nbsp; 产地：</td>
                    <td class="td_a">
                    	<div id="category">
	                        <a href="#" class="active">不限</a>
	                        <a href="#">北京</a>
	                        <a href="#">上海</a>
	                        <a href="#">广东</a>
	                        <a href="#">福建</a>
	                        <a href="#">江西</a>
	                        <a href="#">浙江</a>
	                        <a href="#">湖北</a>
	                        <a href="#">四川</a>
	                        <a href="#">江苏</a>
	                        <a href="#">辽宁</a>
	                        <a href="#">安徽</a>
	                        <a href="#">湖南</a>
	                        <a href="#">贵州</a>
	                        <a href="#">云南</a>
	                        <a href="#">海南</a>
	                        <a href="#">河北</a>
	                        <a href="#">陕西</a>
                        </div>
                    </td>
                </tr>
                <tr>
                    <td>口味：</td>
                    <td class="td_a">
                    	<div id="type">
	                        <a href="#" class="active">不限</a>
	                        <a href="#">原味</a>
	                        <a href="#">香脆</a>
	                        <a href="#">浓香</a>
	                        <a href="#">抹茶</a>
	                        <a href="#">泡椒</a>
	                        <a href="#">黄瓜</a>
	                    </div>
                    </td>
                </tr>
            </table>
        </div>
     </div>
        <!--End 筛选条件 End-->
<!--*******************  搜索部分  ****************************-->
	<div class="guessyou" id="guessyou" >     
		<ul class="p-list" style="height: 100%" >
			<div id="showGoods"></div>   
		</ul>
	</div>

<!--***********************************************-->

	<div class="lazy-fn lazy-fn-done" id="lazy-footer">        
		<div id="service-2014">
	<div class="slogen">
		 <img src="../../images/duo.png" alt="">
	</div>
	<div class="w">
		<dl class="fore1">
			<dt>购物指南</dt>
			<dd>
				<div><a rel="nofollow" target="_blank" href="#">购物流程</a></div>
				<div><a rel="nofollow" target="_blank" href="#">会员介绍</a></div>
				<div><a rel="nofollow" target="_blank" href="#">生活旅行/团购</a></div>
				<div><a rel="nofollow" target="_blank" href="#">常见问题</a></div>
				<div><a rel="nofollow" target="_blank" href="#">大家电</a></div>
				<div><a rel="nofollow" target="_blank" href="#">联系客服</a></div>
			</dd>
		</dl>
		<dl class="fore2">		
			<dt>配送方式</dt>
			<dd>
				<div><a rel="nofollow" target="_blank" href="#">上门自提</a></div>
				<div><a rel="nofollow" target="_blank" href="#">211限时达</a></div>
				<div><a rel="nofollow" target="_blank" href="#">配送服务查询</a></div>
				<div><a rel="nofollow" target="_blank" href="#">配送费收取标准</a></div>
				<div><a target="_blank" href="#">海外配送</a></div>
			</dd>
		</dl>
		<dl class="fore3">
			<dt>支付方式</dt>
			<dd>
				<div><a rel="nofollow" target="_blank" href="#">货到付款</a></div>
				<div><a rel="nofollow" target="_blank" href="#">在线支付</a></div>
				<div><a rel="nofollow" target="_blank" href="#">分期付款</a></div>
				<div><a rel="nofollow" target="_blank" href="#">邮局汇款</a></div>
				<div><a rel="nofollow" target="_blank" href="#">公司转账</a></div>
			</dd>
		</dl>
		<dl class="fore4">		
			<dt>售后服务</dt>
			<dd>
				<div><a rel="nofollow" target="_blank" href="#">售后政策</a></div>
				<div><a rel="nofollow" target="_blank" href="#">价格保护</a></div>
				<div><a rel="nofollow" target="_blank" href="#">退款说明</a></div>
				<div><a rel="nofollow" target="_blank" href="#">返修/退换货</a></div>
				<div><a rel="nofollow" target="_blank" href="#">取消订单</a></div>
			</dd>
		</dl>
		<dl class="fore5">
			<dt>特色服务</dt>
			<dd>		
				<div><a target="_blank" href="#">夺宝岛</a></div>
				<div><a target="_blank" href="#">DIY装机</a></div>
				<div><a rel="nofollow" target="_blank" href="#">延保服务</a></div>
				<div><a rel="nofollow" target="_blank" href="#">京东E卡</a></div>	
				<div><a rel="nofollow" target="_blank" href="#">京东通信</a></div>
				<div><a rel="nofollow" target="_blank" href="#">京东JD+</a></div>
			</dd>
		</dl>
		<div id="coverage">
			<div class="dt">
				京东自营覆盖区县
			</div>
			<div class="dd">
				<p>京东已向全国2423个区县提供自营配送服务，支持货到付款、POS机刷卡和售后上门服务。</p>
				<p class="ar"><a target="_blank" href="http://help.jd.com/user/issue/103-983.html">查看详情&nbsp;&gt;</a></p>
			</div>
		</div>
		<span class="clr"></span>
	</div>
</div>        <div class="w">
	<div id="footer-2014" >
		<div class="links">
			<a rel="nofollow" target="_blank" href="#">关于我们</a>|<a  href="#">联系我们</a>|<a rel="nofollow" target="_blank" href="#">商家入驻</a>|<a rel="nofollow" target="_blank" href="#">营销中心</a>|<a rel="nofollow" target="_blank" href="#">手机京东</a>|<a target="_blank" href="#">友情链接</a>|<a target="_blank" href="#">销售联盟</a>|<a href="#" target="_blank">京东社区</a>|<a href="#" target="_blank">京东公益</a>|<a href="#" target="_blank">English Site</a>|<a href="#" target="_blank">Contact Us</a></div>
		<div class="copyright">
			<a target="_blank" href="#"><img src="../../images/56a0a994Nf1b662dc.png"> 京公网安备 11000002000088号</a>&nbsp;&nbsp;|&nbsp;&nbsp;京ICP证070359号&nbsp;&nbsp;|&nbsp;&nbsp;<a target="_blank" href="#">互联网药品信息服务资格证编号(京)-经营性-2014-0008</a>&nbsp;&nbsp;|&nbsp;&nbsp;新出发京零&nbsp;字第大120007号<br><a rel="nofollow" href="#" target="_blank">音像制品经营许可证苏宿批005号</a>&nbsp;&nbsp;|&nbsp;&nbsp;出版物经营许可证编号新出发(苏)批字第N-012号&nbsp;&nbsp;|&nbsp;&nbsp;互联网出版许可证编号新出网证(京)字150号<br><a href="#" target="_blank">网络文化经营许可证京网文[2014]2148-348号</a>&nbsp;&nbsp;违法和不良信息举报电话：4006561155&nbsp;&nbsp;Copyright&nbsp;©&nbsp;2004-2016&nbsp;&nbsp;京东JD.com&nbsp;版权所有<br>京东旗下网站：<a target="_blank" href="http://www.360top.com/">360TOP</a>&nbsp;&nbsp;<a href="#" target="_blank">拍拍网</a>&nbsp;&nbsp;<a href="#" target="_blank">网银在线</a></div>
		
	  </div>
    </div>
  </div>
	</div>
</body>
<script src="../../js/jquery-1.11.3.min.js" ></script>
<script src="../../js/index.js" ></script>
 <script type="text/javascript">
	function showGoods(typeNo){
		var goodsType = "坚果炒货";
		if(typeNo == 1){
			goodsType = "饼干蛋糕";
		}else if(typeNo == 2){
			goodsType = "糖果巧克力";
		}else if(typeNo == 3){
			goodsType = "肉类制品";
		}else if(typeNo == 4){
			goodsType = "膨化食品";
		}else if(typeNo == 5){
			goodsType = "饮料牛奶";
		}
		$.ajax({// 进行提交
			type : "post",// 提交方式
			url : "${pageContext.request.contextPath}/User/showGoods",// 提交路径
			async : true,// 是否异步
			dataType : 'json',// 数据格式（不进行跨越json，进行跨越jsonp）
			data : {
				goodsType : goodsType
			},
			success : function(data) {// 执行成功后调动的方法
				var content = "";
					for(var i = 0;i < data.length;i++){
						var item = data[i];
						content  += "<li class='fore1'><div class='p-img'>";
						content += "<a target='_blank' href='#'><img width='150' height='150' src='${pageContext.request.contextPath}/images/"+item.goodsPhoto+"'></a></div>";
						content += "<div class='p-name'><a target='_blank' href='#'>"+item.goodsName+"</a></div> ";
						content += "<div class='p-price'><span>￥</span><span>"+item.goodsPrice+"</span></div>";
						content += "</li>";
					}
					$("#showGoods").html(content);
			},
			error : function(err) {// 执行失败后的失败信息的显示
				console.log(err);
			}
		});
	}
	
	
	/* 筛选条件 */
	var dSpan = document.getElementById('direction').getElementsByTagName('a');
    var cSpan = document.getElementById('category').getElementsByTagName('a');
    var tSpan = document.getElementById('type').getElementsByTagName('a');
    var aSpan = document.getElementById('goods_tj').getElementsByTagName('a');
    var oDirection = document.getElementById('direction');
    var oCategory = document.getElementById('category');
    var oType = document.getElementById('type');
    var oRes = document.getElementById('Res');
    dSpan[0].className = 'active';
    cSpan[0].className = 'active';
    tSpan[0].className = 'active';
    for(var i=0; i<aSpan.length; i++){
		aSpan[i].onclick = function(){
			var siblings = this.parentNode.children;
            for(var j=0; j<siblings.length; j++){
				siblings[j].className = '';
            }
            this.className = 'active';
            if(this.parentNode == oDirection || this.parentNode == oCategory || this.parentNode == oType){
                returnRes();
            }
        }
    }
    returnRes();
    function returnRes(){
        var o1 = 0, o2 = 0, o3 = 0;
        for(var i=0; i<dSpan.length; i++){
            if(dSpan[i].className == 'active'){
                o1 = i;
            }
        }
        for(var i=0; i<cSpan.length; i++){
            if(cSpan[i].className == 'active'){
                o2 = i;
            }
        }
        for(var i=0; i<tSpan.length; i++){
            if(tSpan[i].className == 'active'){
                o3 = i;
            }
        }
        oRes.innerHTML = ("品牌：" + dSpan[o1].innerHTML + "," + "&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;" + "产地：" + cSpan[o2].innerHTML + "," + "&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;" + "口味：" + tSpan[o3].innerHTML);
        var shopName = dSpan[o1].innerHTML;
        var goodsAddress = cSpan[o2].innerHTML;
        var goodsTaste = tSpan[o3].innerHTML;
        var goodsName = document.getElementById('textt').value;
        $.ajax({// 进行提交
			type : "post",// 提交方式
			url : "${pageContext.request.contextPath}/User/findGoods",// 提交路径
			async : true,// 是否异步
			dataType : 'json',// 数据格式（不进行跨越json，进行跨越jsonp）
			data : {
				shopName : shopName,
				goodsAddress : goodsAddress,
				goodsTaste : goodsTaste,
				goodsName : goodsName
			},
			success : function(data) {// 执行成功后调动的方法
				var content = "";
				if(null == data[0]){
					content += "<img src='../../images/findFiled.png'>";
					$("#showGoods").html(content);
				}else{
					for(var i = 0;i < data.length;i++){
						var item = data[i];
						content  += "<li class='fore1'><div class='p-img'>";
						content += "<a target='_blank' href='${pageContext.request.contextPath}/detail?goodsId="+item.goodsId+"'><img width='150' height='150' src='${pageContext.request.contextPath}/images/"+item.goodsPhoto+"'></a></div>";
						content += "<div class='p-name'><a target='_blank' href='#'>"+item.goodsName+"</a></div> ";
						content += "<div class='p-price'><span>￥</span><span>"+item.goodsPrice+"</span></div>";
						content += "</li>";
					}
					$("#showGoods").html(content);
				}
			},
			error : function(err) {// 执行失败后的失败信息的显示
				console.log(err);
			}
		});
    } 
</script> 
</html>